<template>
	<div id="main-wrap">
		
		<div class="main-content">
			<router-view />

		</div>

	</div>
</template>

<script>
	
	import {
		reactive,
		ref,
		isRef,
		toRefs,
		onMounted
	} from "@vue/composition-api";
	import {
		getUserMsg
	} from "@/api/login.js"
	export default {
		name: "main",
		
		setup(props, {
			refs,
			root
		}) {
			//data


			//onMounted
			onMounted(() => {


			})
			//method




			return {



			}
		},

	}
</script>

<style lang="scss" scoped>
	// @import "@/styles/config.scss";
	#main-wrap {
		position: fixed;
		top: $headHeight+32;
		left: $navWidth;
		right: 0;
		bottom: 0;
		border: 20px solid #f7f7f7;
		border-bottom: none;
		@include webkit(transition,all .3s ease 0s);
	}

	.open {
		#main-wrap {
			left: $navWidth
		}
	}

	.close {
		#main-wrap {
			left: $navWidth_1
		}
	}

	.main-content {
		width: 100%;
		height: 100%;
		padding: 22px 22px 0 22px;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
	}
</style>
